<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>个人中心</title>
    <link href="http://cdn.bootcss.com/normalize/7.0.0/normalize.min.css" rel="stylesheet">
    <link rel="stylesheet" href="public/lib/layer/css/layui.css">
    <link rel="stylesheet" href="public/css/public.css">
    <link rel="stylesheet" href="public/css/teacher.css">
</head>

<body id="body">
    <div class="header user">
        <div class="nav-contact">
            <div class="row">
                <ul class="address"></ul>
                <div class="logo">
                	<a href="index.html">
                		<img src="public/images/sdk_logo.jpg" alt="">
                	</a>
                </div>
            </div>
        </div>
        <div class="row nav-menu">
            <div class="inline-block menu"></div>
            <div class="inline-block tool-side"></div>
        </div>
    </div>
    <div class="user-body" id="user">
        <div class="row clearfix">
            <div class="fl user-nav">
                <ul>
                    <li>
                        <div class="nav-title"><i class="icon icon-info"></i><span class="user-arrow">个人资料</span></div>
                        <div class="user-info" id="userInfo"></div>
                    </li>
                    <li class="nav-select current-nav" data-item="focus">
                        <div class="nav-title"><i class="icon icon-focus"></i><span>我的报告</span></div>
                    </li>
                    <li class="nav-select" data-item="records">
                        <div class="nav-title"><i class="icon icon-records"></i><span>我的收入</span></div>
                    </li>
                    <li class="nav-select" data-item="recharge">
                        <div class="nav-title"><i class="icon icon-recharge"></i><span>我的资质</span></div>
                    </li>
                </ul>
            </div>
            <div class="fr user-contain">
                <div class="user-detail" id="userDetail"></div>
                <div class="user-item">
                    <div class="focus-content" id="focus">
                        <h5 class="focus-title">我上传的报告</h5>
                        <div>
                            <input class="open-upload-layer" type="button" name="" value="上传报告" id="J_openLayer">
                        </div>
                        <div class="my-reports" id="J_my_reports">
                        </div>
                        <!-- <div class="fr pagination"></div> -->
                    </div>
                    <div class="records-content" id="records">
                        <h5 class="records-title">我的收入记录</h5>
                        <table class="records-table">
                            <thead>
                                <tr>
                                    <th width="120px">操作</th>
                                    <th width="150px">时间</th>
                                    <th width="110px">金额</th>
                                    <th width="450px">主题</th>
                                </tr>
                            </thead>
                            <tbody id="J_operationRecord"></tbody>
                        </table>
                    </div>
                    <div class="recharge-content" id="recharge">
                        <h5 class="recharge-title">个人简介</h5>
                        <div class="user-intro" id="J_user_intro"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 页脚 -->
    <div class="footer"></div>
    <div class="upload-layer layui-form" id="uploadLayer">
        <!-- <form class="" action="#"> -->
            <div class="layui-form-item">
                <h3>上传报告</h3>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">报告标题</label>
                <div class="layui-input-block">
                    <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">报告摘要</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入摘要" class="layui-textarea" name="outline"></textarea>
                </div>
            </div>
            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">本期主题</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入内容" class="layui-textarea" name="nowContent"></textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">报告类型</label>
                <div class="layui-input-block">
                    <select name="type">
                        <option value=""></option>
                        <option value="A1">A1</option>
                        <option value="A2">A2</option>
                        <option value="A3">A3</option>
                        <option value="B1">B1</option>
                        <option value="B2">B2</option>
                        <option value="B3">B3</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-upload-drag" id="J_uploadFile">
                    <i class="layui-icon"></i>
                    <p>点击上传，或将报告拖拽到此处</p>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit="" lay-filter="demo1" id="formSubmit">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        <!-- </form> -->
    </div>
    <div class="" id="updateIntroLayer">
        <form class="update-layer layui-form" action="">
            <div class="layui-form-item">
                <label class="layui-form-label">真实姓名</label>
                <div class="layui-input-block">
                    <input type="text" name="realName" lay-verify="title" autocomplete="off" placeholder="请输入真实姓名" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">化名</label>
                <div class="layui-input-block">
                    <input type="text" name="aliasName" lay-verify="title" autocomplete="off" placeholder="请输入化名" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">从业年份</label>
                <div class="layui-input-block">
                    <input type="text" name="date" id="date" placeholder="yyyy" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">性别</label>
                <div class="layui-input-block">
                    <input type="radio" name="gender" value="MALE" title="男" checked="">
                    <input type="radio" name="gender" value="FEMALE" title="女">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">学历</label>
                <div class="layui-input-block">
                   <input type="text" name="education" lay-verify="title" autocomplete="off" placeholder="请输入学历" class="layui-input">
                </div>
            </div>
            <!-- <div class="layui-form-item">
                <label class="layui-form-label">籍贯</label>
                <div class="layui-input-block">
                   <input type="text" name="city" lay-verify="title" autocomplete="off" placeholder="请输入籍贯" class="layui-input">
                </div>
            </div> -->
            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">介绍</label>
                <div class="layui-input-block">
                    <textarea placeholder="您的个人风格、擅长领域等" class="layui-textarea" name="intro"></textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit="" id="updateSubmit" lay-filter="demo2">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
    </div>
    <script id="J_userDetail_tpl" type="text/html">
        <div class="fl user-head-photo">
            <img src="public/images/sdk_user_icon.png" data-lazyload-img="{{G.uploadurl + d.base.avator}}" alt="" class="avator">
        </div>
        <div class="fl user-head-detail">
            <div class="user-head-name">
                <div class="fl user-info-name">
                    <span class="name">{{d.user.username}}</span>您好！
                </div>
                <div class="fr user-invite-code">你的邀请码是：<span class="code">{{d.user.exclusiveInviteCode}}</span></div>
            </div>
            <div class="user-head-info">
                <div class="verify inline-block">
                    <span class="verify-item {{# if(d.certification.realName){}}is-real-name-true{{#}else{}}is-real-name-false{{#}}}"></span>
                    <span class="verify-item {{# if(d.user.email){}}is-mail-true{{#}else{}}is-mail-false{{#}}}"></span>
                    <span class="verify-item {{# if(d.user.phone){}}is-phone-true{{#}else{}}is-phone-false{{#}}}"></span>
                </div>
                <ul class="time-ul">
                    <li>
                        上次登录时间：<span class="last-login">{{new Date(d.user.lastLoginTime).format('YYYY-MM-DD HH:ii:ss')}}</span>
                    </li>
                    <li>
                        注册时间：<span class="reg-time">{{new Date(d.user.registrationTime).format('YYYY-MM-DD HH:ii:ss')}}</span>
                    </li>
                </ul>
            </div>
            <div class="remains">
                <div class="inline-block">关注人数：<span class="remain">{{d.extend.attentionNumber}}</span>
                </div>
                <div class="inline-block">累计发布报告：<span class="remain">{{d.extend.contributeNumber}}</span></div>
                <div class="inline-block">累计获得打赏：<span class="total-cost">{{d.extend.exceptionalMoney}}</span></div>
            </div>
        </div>
    </script>
    <script id="J_userInfo_tpl" type="text/html">
        <p class="j-user-name">用户名:{{formatVal(d.user.username)}}</p>
        <p class="user-gender">性别:{{genderShow(d.user.gender)}}</p>
        <p class="user-phone">电话:{{formatVal(d.user.phone)}}</p>
        <p class="user-mail">邮箱:{{formatVal(d.user.email)}}</p>
        <div class="update-password" id="J_update_pwd">修改密码</div>
        <div class="user-logout" id="J_logout">退出登录</div>
    </script>
    <script id="J_reports_tpl" type="text/html">
        <ul class="my-reports-list">
            {{# d.list.forEach(function(val,index){ }}
            <li class="{{#if(val.quintessence){}}quintessence{{#}}}">
                <div class="report-time">{{new Date(val.createTime).format('YYYYMMDD')}}</div>
                <!-- <p>战绩：</p> -->
                <!-- <p class="score">{{formatVal(val.correct,val.correct)}}</p> -->
                <p>下载量：</p>
                <p class="score">{{val.downloadNumber}}</p>
                <p>累计获赏：</p>
                <p class="score">{{formatVal(val.downloadNumber*val.promotionsPrice)}}</p>
            </li>
            {{# }); }}
        </ul>
        {{# if(d.count > d.pageSize){ }}
        <div class="reward-pagination">
            <span class="switch-btn pre-btn" data-btn="pre" data-type="my">&lt;</span>
            <div class="inline-block pages">
                {{# for(var i = 1; i
                < d.count/d.pageSize + 1; i++){ }} <div class="page {{# if(i ==1 ){ }}current-page{{# }; }}" data-page="{{i}}" data-type="my">{{i}}</div>
            {{# }; }}
        </div>
        <span class="switch-btn next-btn" data-btn="next" data-type="my">&gt;</span>
        </div>
        {{# }; }}
    </script>
    <script id="J_user_intro_tpl" type="text/html">
        <div class="intro-contain">
            <div class="intro-item">真实姓名：{{formatVal(d.base.realName)}}</div>
            <div class="intro-item">化名：{{formatVal(d.base.alias)}}</div>
            <div class="intro-item">从业年份：{{new Date(d.base.jobTime).format('YYYY-MM')}}</div>
            <div class="intro-item">性别：{{d.user.gender== 'UNKNOW'?'未知':d.user.gender== 'MALE'?'男':'女'}}</div>
            <div class="intro-item">学历：{{d.base.educationalBackgroundValue}}</div>
            <!-- <div class="intro-item">籍贯：{{d.base.city}}</div> -->
            <div>个人简介：{{formatVal(d.base.introduce)}}</div>
        </div>
        <div class="update-intro">
            <input type="button" value="修改" class="update-btn" id="J_update_btn">
        </div>
    </script>
    <script id="T_operationRecord" type="text/html">
        {{# if(d.length){ }}
            {{# d.forEach(function(item,index){ }}
                <tr>
                    <td>{{showOperationRecord(item.type)}}</td>
                    <td>{{new Date(item.createTime).format('YYYY-mm-dd hh:ii')}}</td>
                    <td>{{item.money}}悬赏币</td>
                    <td class="subject">{{item.data.title}}</td>
                </tr>
            {{# }); }}
        {{# } else { }}
            <tr>
                <td colspan="4">暂无数据</td>
            </tr>
        {{# }; }}
    </script>
    <script src="public/lib/layer/layui.all.js"></script>
    <script src="public/js/G.js"></script>
    <script src="public/js/user.js"></script>
    <script src="public/js/teacher.js"></script>
    <script src="public/js/product.js"></script>
    <script src="public/js/public.js"></script>
    <script src="public/js/operationRecord.js"></script>
    <script>

    var uploadProduct = {
        coverUrl: '',
        downloadUrl: "",
        nowContent: "",
        outline: "",
        teacherName: "",
        teacherType: "",
        title: "",
        type: "",
    }

    teacher.getMy({},function(data){
        console.log(data)
        uploadProduct.teacherName = data.base.name;
        uploadProduct.teacherType = data.base.teacherType;
        laytpl($('#J_userInfo_tpl').html()).render(data, function(html) {
            $('#userInfo').html(html)
        })
        laytpl($('#J_userDetail_tpl').html()).render(data, function(html) {
            $('#userDetail').html(html)
        })
        laytpl($('#J_user_intro_tpl').html()).render(data, function(html) {
            $('#J_user_intro').html(html)
        })
        lazyload()
    })
    product.getList({ teacherId: G.getCookie('sdk_user_id') }, function(res) {
        console.log(res)
        laytpl($('#J_reports_tpl').html()).render(res, function(html) {
            $('#J_my_reports').html(html)
        })
    })

    $(document).on('click', '.nav-select', function() {
        var item = $(this).data('item');
        $(this).addClass('current-nav')
        $(this).siblings('.nav-select').removeClass('current-nav');
        $('#' + item).show();
        $('#' + item).siblings('div').hide()
    })

    $(document).on('click', '#J_openLayer', function() {
        layer.closeAll();
        layer.open({
            area: ['500px', 'auto'],
            title: false,
            closeBtn: 0,
            shadeClose: true,
            type: 1,
            scrollbar: false,
            content: $('#uploadLayer')
        })
    })
    //上传报告
    upload.render({
        elem: '#J_uploadFile', //绑定元素
        url: G.apiurl + 'commons/upload/reports/', //上传接口
        accept: 'file',
        done: function(res) {
            //上传完毕回调
            console.log(res)
            //监听提交
            uploadProduct.downloadUrl = res.data.originalUrl;
        },
        error: function(err) {
            //请求异常回调
            layer.msg(err)
            console.log(err)
        }
    });
   
    //日期
    layui.laydate.render({
        elem: '#date'
    });
    
    $(document).on('click','#J_update_btn',function(){
        layer.closeAll();
        layer.open({
            area: ['500px', 'auto'],
            title: false,
            closeBtn: 0,
            shadeClose: true,
            type: 1,
            scrollbar: false,
            content: $('#updateIntroLayer')
        })
    })
    form.on('submit(demo1)', function(data) {
        if(!uploadProduct.downloadUrl){
            layer.msg('未上传报告')
            return;
        }
        data.field.downloadUrl = uploadProduct.downloadUrl;
        data.field.coverUrl = '';
        console.log(data.field)
        product.add(JSON.stringify(data.field),function(data){
            console.log(data)
            layer.msg('上传报告成功')
            setTimeout(function(){
                loaction.reload();
            },1500)
        })
        return false;
    });
    form.on('submit(demo2)', function(data) {
        console.log(data.field)
        return false;
    });
     function loadOperationRecord(pageId) {
        operationRecord.getList({
            operationRecordType : "OUT",
            pageId : pageId
        }, function(data){
            laytpl($('#T_operationRecord').html()).render(data.list, function(html) {
                $("#J_operationRecord").html(html)
            })
        })
    }
    
    loadOperationRecord(1);
    </script>
</body>

</html>